<!DOCTYPE html>
<html lang="zh">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>euv-demo-问卷-列表</title>
</head>
<body>
    <div id="app">
        <header>
            <img src="../favicon.png" alt="">
            <h2 style="margin: auto 0;">CYue问卷</h2>
            <nav class="header-nav">
                <ul class="nav-menu">
                    <li>
                        <a href="../index.html">首页</a>
                    </li>
                    <li class="nav-menu-item">
                        <a href="#">问卷</a>
                        <ul class="nav-sub-menu">
                            <li>
                                <a href="./list.html">创建问卷</a>
                            </li>
                            <li>
                                <a href="./list.html">查看问卷</a>
                            </li>
                        </ul>
                    </li>
                </ul>
                <ul class="nav-menu" e-show="login" style="display: flex;">
                    <li>
                        <time>{{ nowTime }}</time>
                    </li>
                    <li>
                        <a href="#">{{ user.username }}</a>
                    </li>
                    <li>
                        <a href="#" @click="logout">logout</a>
                    </li>
                </ul>
            </nav>
        </header>
    </div>

    <template
        id="template-question"
    >
        <div
            class="container-question"
        >
            <h3 style="margin-top: 0;">
                question type
            </h3>
            <label for="">
                标题：<input type="text" class="input-title" required>
            </label>
            <label for="">
                题目描述：<input type="text" class="input-description">
            </label>
            <div class="flex-column gap-05em">
                <label for="">选项：</label>
                <ul
                    class="flex-column gap-05em list-option"
                    style="list-style: upper-alpha inside;"
                >
                </ul>
                <div class="flex-row gap-1em">
                    <button
                        class="button-add-option"
                        style="width: fit-content;"
                    >
                        添加选项
                    </button>
                    <button
                        class="button-remove"
                        style="width: fit-content;"
                    >
                        删除题目
                    </button>
                </div>
            </div>
        </div>
    </template>

    <main>
        <div class="container-left">
            <ul class="container-left-list" id="list-question-type">
                <!-- <li
                    class="list-item button text-center"
                >
                </li> -->
            </ul>
        </div>
        <div class="container-right">


            <form
                id="form-question"
                class="flex-column gap-1em"
            >
                <div>
                    <h3 style="margin-bottom: 0.5em;">问卷标题</h3>
                    <input class="input-wj-title" type="text" required>
                </div>
                <div>
                    <h3 style="margin: 0.5em 0;">问卷描述</h3>
                    <textarea class="input-wj-description"></textarea>
                </div>

                <div class="container-button-create">
                    <input class="button primary" type="submit" value="创建问卷">
                </div>
            </form>

        </div>
    </main>
</body>
</html>

